 /* Created by Timothy Cheung
|---------------------------------------------------------------------------------------------------
| XTemplate for Details View Main Details Tab Content (@author : Timothy Cheung)
|---------------------------------------------------------------------------------------------------
| This DataView contains the skeleton code for the HTML content for the Main Details tab
| of Details View. Variables are loaded when the attached store 'DetailsMains' accesses 
| details.php, which loads the details object parsed from the X-services API generated XML
| Variables:
| { img_link }  - Link for URL for accessing the title's thumbnail image, laced with HTML tags    
| { docnum }    - Document Number for generating URL to TP Library Catalogue's page for selected title                                      
| { bktitle }   - Selected title's Book Title                                  
| { author }    - Selected title's Author
| { callnumber }- Selected title's Call Number   
| { edition }   - Selected title's Edition   
| { publisher } - Selected title's Publisher  
| { eBkLink }   - Link with URL to selected title's electronic version, laced with HTML tags for the button  
| { frequency } - Selected title's Frequency, displayed if the title is a Serial
| { desc }      - Selected title's Description
| { bkformat }  - Selected title's Format(BK, SE, VM, etc.)  
| { summary }   - Selected title's Summary
| { issn }      - Selected title's ISSN number, displayed only if the title has an ISSN number  
*/  

Ext.define("MajorProjectSenchaTouch.view.DetailsViewModule.MainTabDataView", {
    extend:"Ext.DataView",
    xtype: "maintabdataview",
   
    config:{
        itemTpl: new Ext.XTemplate('<tpl for=".">',
                                    '<div id="overBlock">',
                                    '<div id="topBlock" class="topWrapper">',
                                        '<div class="wrapped" id="w1">',
                                            '<div class="vtop">{ img_link }</div>',
                                        '<div><a href="http://libcat.tp.edu.sg/F?func=find-b&request={ docnum }&find_code=SYS&CON_LNG=MOB" target="_blank"/>',
                                        '<button class="libcatBtn">Full Record</button></a></div>',
                                            
                                        '</div>',
                                    
                                        '<div class="wrapped" id="w2">',
                                            '<div id="titleBlock">',
                                                '<div id="mtTitle"><h1>{ bktitle }</h1></div>',
                                                '<div><h2>{ author }</h2></div>',
                                                '<div class="mtCall"><h2>{ callnumber }</h2></div>',
                                            '</div>',
                                            '<div id="pubBlock">',
                                            '<div id="miniWrap"><h2>Edition: </h2></div><h4>{ edition }</h4>',
                                            '<div><h2>Publisher: </h2></div><h4>{ publisher }</h4>',
                                        '</div>',
                                    '</div>',
                                    '</div>',
                                    '<div id="btmBlock">',
                                        
                                        '<div class="mtBottom">{ eBkLink }',
                                        '{ frequency }',
                                        '<div class="mtBottomIn"><h2>Description: </h2></div><div id="bmBtn">',
                                        '<input type="button" name="detailsBmBtn" class="{[this.getBookmarkedCls(values.docnum)]}"/></div><h4>{ desc }</h4>',
                                        '<div class="mtBottom"><h2>Format: </h2></div><h4>{ bkformat }</h4>',
                                        '<div class="mtBottom"><h2>Summary: </h2></div><h4>{ summary }</h4>',
                                        '<div class="mtBottom"><h2>{ issn }',
                                    '</div>',
                                '</div>',
                            '</tpl>',                            
                            {
                                compiled: true,                                
                                //Set the bookmark button class. Check if item is in the bookmarked store. (@author : Justina Lee)
                                getBookmarkedCls: function(docnum){
                                    var bmStore = Ext.getStore('BookMarked');
                                    var index = bmStore.find("docnum", docnum);
                                    
                                    if(index === -1){
                                        return "btnAddBookMarked";
                                    }else{
                                        return "btnRemoveBookMarked";
                                    }
                                }
                            }
                            
            ),store: 'DetailsMains',
            listeners:{
            /* when the user tap on the bookmarked button in the details view, the tapDetailsBMBtn
             * is triggered. (@author : Justina Lee) */
            itemtap:function(dv,index,target, record, e){
                var scope = this;
                var tappedTarget = e.target;
                if(tappedTarget.name == "detailsBmBtn"){
                    this.fireEvent('tapDetailsBMBtn', record, tappedTarget);
                }
            }
        }
    }
});


